<!DOCTYPE html>
<html>

<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!--360浏览器优先以webkit内核解析-->


  <title>H+ 后台主题UI框架 - 主页示例</title>

  <link rel="shortcut icon" href="favicon.ico">
  <link href="__PUBLIC__/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
  <link href="__PUBLIC__/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">

  <link href="__PUBLIC__/css/animate.min.css" rel="stylesheet">
  <link href="__PUBLIC__/css/style.min.css?v=4.1.0" rel="stylesheet">


</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
  <div class="row">
    <div class="col-sm-4">
      <div class="ibox float-e-margins">
        <div class="ibox-title">
          <h5>步骤</h5>
        </div>
        <div class="ibox-content no-padding">
          <div class="panel-body">
            <div class="panel-group" id="version">
              {if $common == '1'}
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v41">第一步</a>
                    </h5>
                  </div>
                  <div id="v41" class="panel-collapse collapse in">
                    <div class="panel-body">
                      <ol>
                        <li>填写活动方案（提前四天）</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v40">第二步</a>
                    </h5>
                  </div>
                  <div id="v40" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>收集活动人员信息（提前四天）</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v32">第三步</a>
                    </h5>
                  </div>
                  <div id="v32" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>填写活动申报表（提前三天）</li>
                        <li>将活动申报表和活动方案发送至校青协项目部邮箱：<a href="mailto:3506047462@qq.com?subject={$college}&body=活动方案和活动申报表提交">3506047462@qq.com</a>()提前天</li>
                        <li>打印并提交项目申报表和活动方案，交给校青协项目部（提前三天）</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v31">第四步</a>
                    </h5>
                  </div>
                  <div id="v31" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>物资借用（提前两天）</li>
                        <li>宣传部前期宣传</li>
                        <li>开展活动</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v301">第五步</a>
                    </h5>
                  </div>
                  <div id="v301" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>由参加活动人员填写志愿汇收集表和志愿汇补录表（一天内完成）</li>
                        <li>宣传部编写活动新闻稿</li>
                        <li>宣传部做活动结束宣传</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v30">第六步</a>
                    </h5>
                  </div>
                  <div id="v30" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>填写活动反馈</li>
                        <li>打印并提交给校青协会员部（两天内）</li>
                      </ol>
                    </div>
                  </div>
                </div>
              {else/}
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v21">第一步</a>
                    </h5>
                  </div>
                  <div id="v21" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>收集活动人员信息（提前四天）</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v20">第二步</a>
                    </h5>
                  </div>
                  <div id="v20" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>填写志愿汇申请表,提交至校青协会员部（提前三天）</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v18">第三步</a>
                    </h5>
                  </div>
                  <div id="v18" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>活动前期宣传（提前一天）</li>
                        <li>开展活动</li>
                      </ol>
                    </div>
                  </div>
                </div>
                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h5 class="panel-title">
                      <a data-toggle="collapse" data-parent="#version" href="#v17">第四步</a>
                    </h5>
                  </div>
                  <div id="v17" class="panel-collapse collapse">
                    <div class="panel-body">
                      <ol>
                        <li>由活动人员填写志愿汇时长表和补录表</li>
                        <li>提交给会员部</li>
                        <li>活动结束</li>
                      </ol>
                    </div>
                  </div>
                </div>
              {/if}
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-sm-8">
      <div class="ibox float-e-margins">
        <div class="ibox-title">
          <h5>文件</h5>
        </div>
        <div class="ibox-content no-padding">
          <div class="panel-body">
            <div class="col-sm-12">
              {if $common == '1'}
                {if $step>1}
                  <div class="file-box">
                    <a href="getWord?template_id=1&activity_id={$Id}">
                      <div class="file">
                        <span class="corner"></span>

                        <div class="icon">
                          <i class="fa fa-file-word-o"></i>
                        </div>
                        <div class="file-name">
                          活动方案.docx
                        </div>
                      </div>
                    </a>
                  </div>
                {/if}
                {if $step>3}
                  <div class="file-box">
                    <div class="file">
                      <a href="getWord?template_id=2&activity_id={$Id}">
                        <span class="corner"></span>

                        <div class="icon">
                          <i class="fa fa-file-word-o"></i>
                        </div>
                        <div class="file-name">
                          项目申报表.docx
                        </div>
                      </a>
                    </div>
                  </div>
                {/if}
                {if $step>5}
                <div class="file-box">
                  <a href="getExcel?ActivityId={$Id}&type=1">
                    <div class="file">
                      <span class="corner"></span>

                      <div class="icon">
                        <i class="fa fa-bar-chart-o"></i>
                      </div>
                      <div class="file-name">
                        志愿汇时长表.xlsx
                      </div>
                    </div>
                  </a>
                </div>
                <div class="file-box">
                  <a href="getExcel?ActivityId={$Id}&type=2">
                    <div class="file">
                      <span class="corner"></span>

                      <div class="icon">
                        <i class="fa fa-bar-chart-o"></i>
                      </div>
                      <div class="file-name">
                        志愿汇时长补录表.xlsx
                      </div>
                    </div>
                  </a>
                </div>
                {/if}
                {if $step>6}
                <div class="file-box">
                  <div class="file">
                    <a href="getWord?template_id=3&activity_id={$Id}">
                      <span class="corner"></span>

                      <div class="icon">
                        <i class="fa fa-file-word-o"></i>
                      </div>
                      <div class="file-name">
                        活动反馈表.docx
                      </div>
                    </a>
                  </div>
                </div>
                {/if}

              {else/}
                {if $step>2}
                <div class="file-box">
                  <div class="file">
                    <a href="getWord?template_id=4&activity_id={$Id}">
                      <span class="corner"></span>

                      <div class="icon">
                        <i class="fa fa-file-word-o"></i>
                      </div>
                      <div class="file-name">
                        志愿汇登记表.docx
                      </div>
                    </a>
                  </div>
                </div>
                {/if}
                {if $step>4}
                <div class="file-box">
                  <a href="getExcel?ActivityId={$Id}&type=1">
                    <div class="file">
                      <span class="corner"></span>

                      <div class="icon">
                        <i class="fa fa-bar-chart-o"></i>
                      </div>
                      <div class="file-name">
                        志愿汇时长表.xlsx
                      </div>
                    </div>
                  </a>
                </div>
                <div class="file-box">
                  <a href="getExcel?ActivityId={$Id}&type=2">
                    <div class="file">
                      <span class="corner"></span>

                      <div class="icon">
                        <i class="fa fa-bar-chart-o"></i>
                      </div>
                      <div class="file-name">
                        志愿汇时长补录表.xlsx
                      </div>
                    </div>
                  </a>
                </div>
                {/if}
              {/if}
            </div>
          </div>
          {if $completed!='true'}
            <div class="panel-body" id="button">
              <div class="panel-group" id="version1">
                {if $click=='false'}
                  <a class="btn btn-success btn-outline" href="{$url}">
                    <i class="fa fa-edit"> </i> {$stepName}
                  </a>
                {else/}
                  <button class="btn btn-success btn-outline" id="button1" v-on:click="request('{$url}')">
                    <i class="fa fa-step-forward"> </i> {$stepName}
                  </button>
                {/if}
              </div>
            </div>
          {/if}
      </div>
    </div>
  </div>
</div>

<!-- 全局js -->
<script src="__PUBLIC__/js/jquery.min.js?v=2.1.4"></script>
<script src="__PUBLIC__/js/bootstrap.min.js?v=3.3.6"></script>
<script src="__PUBLIC__/js/layui/layui.all.js"></script>
<script src="__PUBLIC__/js/vue.js"></script>
<script src="__PUBLIC__/js/vue-resource.js"></script>
<script>
  let button=new Vue({
    el:"#button",
    data:{

    },
    methods:{
      request:function (url){
        this.$http.get(url).then(
            (data)=>{
                if (data.body.result==='success')
                {
                  layer.msg('操作成功');
                  $("#button1").attr('disabled',true);
                  location.reload();
                }
                else
                {
                  layer.msg(data.body.msg);
                }
            }
        )
      }
    }

  })
</script>
</body>

</html>
